@extends('Layout/base')

@section('header-js')

    <!-- <link rel="shortcut icon" type="image/x-icon" href="{{ asset('icon/favicon.ico') }}"> -->
	<link rel="stylesheet" type="text/css" href="{{ asset('css/base.css') }}">
	<link rel="stylesheet" type="text/css" href="{{ asset('css/home.css') }}">
	<script type="text/javascript" src="{{ asset('js/jquery.js') }}"></script>

@endsection


@section('content')

    <div class="yHeader">
        <div class="yNavIndex">
            <div class="pullDown">
                <h2 class="pullDownTitle">全部商品分类</h2>
            </div>
            <ul class="yMenuIndex">
            @foreach($types as $v)
                <li><a href="{{ route('Home.goodsList', ['id' => $v['id']])}}" target="_blank">{{ $v['type_name'] }}</a></li>
            @endforeach
            </ul>
        </div>
    </div>
</header>
<!-- header End -->
<div class="containers"><div class="pc-nav-item"><a href="#" class="pc-title">首页</a> > <a href="#">限时抢购</a> > <a href="#">即将开始</a> </div></div>
<div class="containers"><div class="pc-add-item"><img src="{{ asset('img/ad/hot2.jpg') }}"></div></div>
<div class="pc-buying clearfix">
    <div class="time-list time-list-w fl">
    @if(empty($sales))
        <div class="pc-no"><h3>抱歉，暂无促销商品</h3></div>
    @else
        <div class="time-title time-clear">
            <h2>距本场结束剩余：</h2>
            <div class="time-item fl clearfix">
                <strong id="day_show">00</strong>
                <strong class="pc-clear-sr">-</strong>
                <strong id="hour_show">00</strong>
                <strong class="pc-clear-sr">:</strong>
                <strong id="minute_show">00</strong>
                <strong class="pc-clear-sr">:</strong>
                <strong id="second_show">00</strong>
            </div><!--倒计时模块-->
            <a href="javascript:;" onClick="change()" class="reds fr">换一批></a>
        </div>
        <div class="time-border time-border-h time-border-list clearfix change">
            <ul>
            @foreach($sales as $v)
                <li>
                    <a href="{{route('goods.goodsdetail', ['id' => $v['goods_id']])}}"> <img src="http://oydt3ttm3.bkt.clouddn.com/{{ $v['goods_pic'] }}" width="213" height="213"></a>
                    <p class="head-name"><a href="#">{{ $v['goods_name'] }}</a> </p>
                    <p><span class="price">￥{{ $v['promate_price'] }}</span><span class="discount">￥{{ $v['price'] }}</span></p>
                    <p class="label-default">仅售:{{ $v['promate_num'] }}件</p>
                    <p><h3 style="color:red">结束时间:{{ $v['end_time'] }}</h3></p>
                    <a style="width:200px;height:50px;display:block;border:1px solid red;text-align:center;line-height:50px;background:#F4645F;font-size:30px;color:white;border-radius:5px" href="{{route('goods.goodsdetail', ['id' => $v['goods_id']])}}">立即抢购</a>
                </li>
            @endforeach    
            </ul>
        </div>
    @endif
    </div>
</div>

@endsection

@section('foot-js')

<script type="text/javascript">

    //点击换一换
    function change() {
        $.ajax({
            type: 'get',
            url: '{{ route("Home.saleschange") }}',
            dataType: 'json',
            beforeSend: function() {

                //显示loading的图片
                var str ='<div style="width:1349px; height:280px; background-color:white;display: table-cell;vertical-align: middle;text-align: center;"><img src="{{ asset('images/lazyloading2.gif')}}" align="middle" style="width:300px; height:300px;" /></div>'; 

                $('.change').html( str ); 

            },
            success: function(data) {
                var ul = '<ul>';
                for (key in data) {
                    ul += '<li><a href="#"> <img src="http://oydt3ttm3.bkt.clouddn.com/'+ data[key].goods_pic +'" width="213" height="213"></a><p class="head-name"><a href="#">'+ data[key].goods_name +'</a> </p><p><span class="price">￥'+ data[key].promate_price +'</span><span class="discount">￥'+ data[key].price +'</span></p><p class="label-default">仅售:'+ data[key].promate_num +'件</p><p><h3 style="color:red">结束时间:'+ data[key].end_time +'</h3></p><a style="width:200px;height:50px;display:block;border:1px solid red;text-align:center;line-height:50px;background:#F4645F;font-size:30px;color:white;border-radius:5px" href="#">立即抢购</a></li>';
                }
                ul += '</ul>';
                $('.change').html( ul );

            }
        });

    };


         
//倒计时
var intDiff = parseInt({{$time}});//倒计时总秒数量
     function timer(intDiff){
         window.setInterval(function(){
             var day=0,
                     hour=0,
                     minute=0,
                     second=0;//时间默认值
             if(intDiff > 0){
                 day = Math.floor(intDiff / (60 * 60 * 24));
                 hour = Math.floor(intDiff / (60 * 60)) - (day * 24);
                 minute = Math.floor(intDiff / 60) - (day * 24 * 60) - (hour * 60);
                 second = Math.floor(intDiff) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
             }
             if (minute <= 9) minute = '0' + minute;
             if (second <= 9) second = '0' + second;
             $('#day_show').html('<s id="h"></s>'+ day +'');
             $('#hour_show').html('<s id="h"></s>'+hour+'');
             $('#minute_show').html('<s></s>'+minute+'');
             $('#second_show').html('<s></s>'+second+'');
             intDiff--;
         }, 1000);
     }

     $(function(){
         timer(intDiff);
     });

     (function(a){
         a.fn.hoverClass=function(b){
             var a=this;
             a.each(function(c){
                 a.eq(c).hover(function(){
                     $(this).addClass(b)
                 },function(){
                     $(this).removeClass(b)
                 })
             });
             return a
         };
     })(jQuery);

     $(function(){
         $("#pc-nav").hoverClass("current");
     });






</script>


@endsection
